// config 社区拼团
import { View, Text, Image, Navigator } from '@tarojs/components';
import './Community.scss';
import Taro from '@tarojs/taro';
import { AtSearchBar, AtButton, AtCountdown } from 'taro-ui';
// 引入图片
import src from '../../../static/images/tu.png'
import { useEffect, useState } from 'react';
import http from '../../../utils/http'
// import { set } from 'lodash';
import store from '../../../store'
// 商品属性


const Community = () => {
    // 页面一上来就加载商品数据
    useEffect(() => {
        console.log("limt", Taro.getStorageSync("limt"));
        http({
            url: '/user/goodsList',
            // url: '/user/groupCommunityQueryList',
            method: 'get',
            header: {
                'token': Taro.getStorageSync('token')
            },
            data: {
                communityName: ''

            },
        }).then((res) => {
            console.log(res);
            console.log(Taro.getStorageSync('limts'));
        })
    }, [])
    // input搜索
    const [isSearch, setSearch] = useState()
    const onChange = (v) => {
        setSearch(v)
        console.log(v);
    }
    const [limt, setLimt] = useState([])
    const ComTit = () => {
        const [comArr, setArr] = useState([{ name: '社区名称', comnum: '500', team: '陈咬金' }])
        if (!limt.length) {
            return <View>
                {comArr.map((v, i) => {
                    return <View className='com_one' key={i}>
                        <View className='group_name'>
                            <Text>{v.name}</Text>
                            <Navigator url='../Change/Change'>切换拼团点</Navigator>
                        </View>
                        <View className='com_msg'>
                            <Text>成员：{v.comnum}人</Text> | <Text>团长：{v.team}</Text> <Text className='at-icon at-icon-phone'></Text>
                        </View>
                    </View>
                })}
            </View>
        } else {
            return limt.map((v, i) => {
                return (
                    <View className='com_one' key={i} >
                        <View className='group_name'>
                            <Text>{v.communityName}</Text>
                        </View>
                        <View className='com_msg'>
                            <Text>成员：200人</Text> | <Text>团长：{v.psName}</Text> <Text className='at-icon at-icon-phone'>{v.psPhone}</Text>
                        </View>
                    </View>
                )
            })
        }
    }

    // 社区渲染
    let Arr = () => {
        const [comArr, setArr] = useState([{ name: '社区名称', comnum: '500', team: '陈咬金' }])

        return <View>
            {comArr.map((v, i) => {
                return <View className='com_one' key={i}>
                    <View className='group_name'>
                        <Text>{v.name}</Text>
                        <Navigator url='../Change/Change'>切换拼团点</Navigator>
                    </View>
                    <View className='com_msg'>
                        <Text>成员：{v.comnum}人</Text> | <Text>团长：{v.team}</Text> <Text className='at-icon at-icon-phone'></Text>
                    </View>
                </View>
            })}
        </View>
    }

    // 商品信息
    let Shopping = () => {
        const [shopArr, setShop] = useState([{}])

        return <View>
            {
                shopArr.map((v, i) => {
                    return <View className='com_img' key={i}>
                        <Image src={src}></Image>
                        <Navigator url='../Commodity/Commodity' className='com_text'>
                            <View className='at-row text_one'>
                                <View className='at-col at-col-9'>
                                    <Text className='t_people'>3人成团</Text>
                                    <Text> 精品泰国桂圆 1000g/盒</Text>
                                </View>
                                <View className='at-col at-col-3 text_right'>
                                    <Text>￥7.8</Text>
                                    <Text className='del_line'> ￥14.6</Text>
                                </View>
                            </View>
                            <View className='at-row text_two'>
                                <Text className='at-col at-col-8'>已成5团 / 可成10团 / 每人限购1分</Text>
                                <Text className='at-col at-col-4 text_right'>提货点：鲜丰水果</Text>
                            </View>
                            <View className='at-row text_three'>
                                <View className='at-col at-col-9'>
                                    <Text>剩余 </Text>
                                    {/* 倒计时 */}
                                    <AtCountdown
                                        className='green'
                                        format={{ day: '天', hours: ':', minutes: ':', seconds: '' }}
                                        isCard
                                        isShowDay
                                        day={2}
                                        hours={1}
                                        minutes={1}
                                        seconds={10}
                                    />
                                </View>
                                <View className='at-col at-col-3 text_right'>下单2小时后</View>
                            </View>
                        </Navigator>
                        <Navigator url='../Order/Order' >
                            <AtButton className='button' size='small'>立即拼团</AtButton>
                        </Navigator>
                    </View>
                })
            }
        </View>
    }

    return <View>
        <ComTit />

        {/* input搜索 */}
        <View className='com_inp'>
            <AtSearchBar
                placeholder='输入团购商品名称查询'
                value={isSearch}
                onChange={onChange.bind(this)}
            />
        </View>

        {/* 商品图片信息 */}
        <Shopping />
    </View>
}
export default Community;